<template>
  <el-dialog title="表单授权" :visible.sync="isShow" width="400px" top="60px">
    <div class="dialog-scroll" :style="{ maxHeight }">
      <el-tree
        ref="keys"
        :data="data"
        show-checkbox
        node-key="id"
        :props="defaultProps"
        :default-checked-keys="checked"
      />
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button :loading="loading" size="mini" @click="closePage"
        >取消</el-button
      >
      <el-button
        :loading="loading"
        type="primary"
        size="mini"
        @click="onOkBtnClick"
        >保存</el-button
      >
    </div>
  </el-dialog>
</template>

<script>
import { forms } from '@/api/form'
import { auth, authChecked } from '@/api/tenant'
import Cookies from 'js-cookie'
import maxHeight from '@/mixins'
export default {
  props: {
    value: {
      type: Object,
      default: () => Object.create({}),
    },
  },
  mixins: [maxHeight],
  data() {
    return {
      isShow: true,
      defaultProps: {
        children: 'children',
        label: 'name',
      },
      checked: [],
      data: [
        {
          id: '1d61ec1791102f45f0f52b52e2ab6b7b',
          name: '建筑建材',
          children: [
            {
              id: 'hj',
              name: '房地产',
              children: [
                {
                  id: 'hj',
                  name: '桁架',
                },
                {
                  id: 'gj',
                  name: '箍筋',
                },
              ],
            },
            {
              id: 'gj',
              name: '市政工程',
              children: [
                {
                  id: 'hj',
                  name: '桁架',
                },
                {
                  id: 'gj',
                  name: '箍筋',
                },
              ],
            },
          ],
        },
        {
          id: 'ycl',
          name: '农林牧渔',
          children: [
            {
              id: 'gj',
              name: '农业',
              children: [
                {
                  id: 'hj',
                  name: '豆类',
                },
                {
                  id: 'gj',
                  name: '棉类',
                },
              ],
            },
            {
              id: 'gb',
              name: '家具制造',
              children: [
                {
                  id: 'hj',
                  name: '园艺用具',
                },
                {
                  id: 'gj',
                  name: '农用品',
                },
              ],
            },
          ],
        },
      ],
    }
  },
  watch: {
    isShow: function() {
      this.$emit('input', null)
    },
  },
  created() {
    // this.get(this.value.id || null)
  },
  methods: {
    onOkBtnClick() {
      this.submitForm()
    },
    submitForm() {
      const treeKeys = this.$refs.keys
        .getCheckedKeys()
        .concat(this.$refs.keys.getHalfCheckedKeys())
      auth(this.value.id, treeKeys)
        .then(() => {
          this.isShow = false
          this.$parent.onSearchBtnClick()
        })
        .catch(() => {})
    },
    resetForm() {
      this.$refs['form'].resetFields()
    },
    closePage() {
      this.isShow = false
      this.resetForm()
    },
    async get(id) {
      const chooseLanguage = Cookies.get('language')
      forms({ language: chooseLanguage }).then((data) => {
        this.data = data
        authChecked(id).then((data) => {
          this.checked = data
        })
      })
    },
  },
}
</script>
